<template>
  <div id="app">
    <router-view></router-view>
  </div>
</template>

<style lang="scss">
@import "@/assets/scss/reset.scss";
#app {
  font-family: Microsoft Yahei;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  background-color: #f0f1f2;
}

.ant-popover {
  width: 292px;
  .ant-popover-content {
    .ant-popover-inner {
      div {
        .ant-popover-inner-content {
          padding: 9px 5px 16px 24px;
          font-size: 12px;
          color: black;
          .noLogin {
            display: block;
            text-align: center;
            box-sizing: border-box;
            font-size: 16px;
            color: #6c7073;
            padding: 16px;
          }
          .cart {
            height: 225px;
            overflow-y: scroll;
            .cart-record {
              border-bottom: 3px solid #f7f9fa;
              a {
                display: flex;
                // justify-content: space-between;
                padding: 12px 0;
                color: black;
                .img {
                  margin-right: 16px;
                  img {
                    width: 50px;
                    margin: auto 0;
                  }
                }
                .info {
                  span {
                    display: block;
                  }
                  .productName {
                    font-size: 16px;
                  }
                }
              }
            }
          }
          .settlement {
            padding: 16px 0 9px;
            .settlement-top {
              margin-bottom: 12px;
              display: flex;
              justify-content: space-between;
              span {
                line-height: 16px;
              }
              .price {
                font-size: 16px;
              }
            }
            .settlement-bottom {
              button {
                width: 100%;
                height: 42px;
                color: white;
                font-size: 16px;
                background-color: #1890ff;
                border: 0;
                border-radius: 5px;
              }
            }
          }
        }
      }
    }
  }
}
div {
  .popup {
    .ant-modal-mask {
      background-color: rgba(0, 0, 0, 0.15);
    }
    .ant-modal-wrap {
      .ant-modal {
        width: 675px !important;
        .ant-modal-content {
          .ant-modal-header {
            .ant-modal-title {
              text-align: center;
            }
          }
          .ant-modal-body {
            .delTip {
              display: block;
              text-align: center;
            }
            .form {
              div {
                margin: 0 0 36px;
                position: relative;
                .ant-input {
                  height: 44px;
                  color: black;
                }
                .tip {
                  color: red;
                  position: absolute;
                  top: 44px;
                  left: 0;
                }
              }
              div:first-of-type {
                margin: 0 0 24px;
              }
              .cascader {
                position: relative;
                .ant-cascader-picker {
                  width: 100%;
                  position: static;
                  .ant-cascader-input {
                    height: 44px;
                    width: 100%;
                    background-color: yellow;
                  }
                }
                .addressTip {
                  color: red;
                  position: absolute;
                  top: 44px;
                  left: 0;
                }
              }
            }
          }
        }
      }
    }
  }
  .delAdr {
    .ant-modal-mask {
      background-color: rgba(0, 0, 0, 0.15);
    }
    .ant-modal-wrap {
      .ant-modal {
        // width: 675px !important;
        .ant-modal-content {
          .ant-modal-header {
            .ant-modal-title {
              text-align: center;
            }
          }
          .ant-modal-body {
            .delTip {
              display: block;
              text-align: center;
              color: firebrick;
            }
          }
        }
      }
    }
  }
}
</style>
